# node
FROM node:12.13.0  as build-stage

#维护信息
MAINTAINER changcheng "742450622@qq.com"

RUN echo "----------------------------  web environment configuration  ---------------------------------"

# 指定接下来的工作路径为  /app  相当于 cd  -> /app
WORKDIR /webapp

#拷贝 前端项目 当前目录下的所有文件到 webapp目录下（./ 指当前所有的代码路径  . 指上一步cd到的app的路径）
COPY ./ .

#设置淘宝 npm镜像源
#RUN npm install -g cnpm --registry=https://registry.npm.taobao.org

RUN npm cache clean --force

# 安装依赖
RUN npm install

#打包  目的是丢到  nginx下面去跑
RUN npm run build:prod

# ==================================== 上：npm 已打包 下：nginx 运行 ==========================================
# nginx 镜像
FROM nginx:1.15.12-alpine as production-stage

# 维护者信息
MAINTAINER changcheng "742450622@qq.com"

# 移除nginx容器中的 default.conf 文件 、nginx的配置文件
RUN rm /etc/nginx/conf.d/default.conf
RUN rm /etc/nginx/nginx.conf

# 把主机中的  nginx.conf 文件复制到 nginx的 原来的位置
COPY ./docker/nginx.conf  /etc/nginx

# 拷贝前端 vue项目目录打包后的文件到 nginx下 运行
COPY --from=build-stage  /webapp/dist  /usr/share/nginx/html

# 暴露8080 端口
EXPOSE 8101

# 注：CMD不同于RUN，CMD用于指定在容器启动时所要执行的命令，而RUN用于指定镜像构建时所要执行的命令。
#    RUN指令创建的中间镜像会被缓存，并会在下次构建中使用。如果不想使用这些缓存镜像，可以在构建时指定--no-cache参数，如：docker build --no-cache

# 使用daemon off的方式将nginx运行在前台保证镜像不至于退出
CMD ["nginx", "-g", "daemon off;"]

